This was the second project I worked on, I was given the task of revamping the user interface of an existing app developed by Ngee Ann Polytechnic. I chose to do mine on Medical Abbreviations.

There were many different apps to choose from, but I decided to choose medical abbreviations as I felt that its purpose was well-served, it was just lacking in proper user interface design. I also thought that I could add in some additional features and enhance existing ones to make the user experience much more enjoyable.

I sketched out the flow and placement of things, using a lot of placeholder text and general terms to give myself an easier time when I move on to prototyping. The screen I was designing for was that of an Iphone 5, so I had to make sure my sketches fit as well. 

These sketches were the foundation and once they were done, I began to do my paper prototype.

The next step after the sketches were done was to do paper prototyping. This helped me visualise what the final product may look like better and firmed up any doubts or uncertainties I had about the flow and the navigation from page to page.

It also helped me to understand better how big each button should be in order to be easily accessible and at the same time not get in the way of other functions.

After I was satisfied with my paper prototype, I moved onto doing mockups on Photoshop. In this stage, I was able to finalise the colour scheme and made sure it tied in with the overall theme and feel of the app. As it was still a mockup, I didn't include any images I intended to use. However, I stopped using placeholder text.

Now that all the preparation was done, it was time to bring my product to life by making a final and digital prototype. Using the screens from my mockup, I pieced everything together and created a final prototype for Medical Abbreviations 2.0.

Make sure to zoom out before viewing the prototype, otherwise the screen will be cut off.